define(['../gallery','../model/data'],function(ga,DATA){
    return (function(){
        var hid = "#innovation";
        var imgid = -1;
        var imgIdx = -1;
        var imgGroupIdx = -1;
        var delGroupBtnId = -1;
        var lis = null;
        function amIMG($element,type,hwd){
            var len = $element.length;
            var html = '';

            if(type=="carousel") {
                if(len>5){
                    len=5;
                }
                var idx = hwd.parent().parent().index();//第几组图片
                if(DATA.adImagesGroup[idx]){
                    DATA.adImagesGroup[idx]=[];
                }
            }

            for(var i=0;i<len;i++){
                var the = $($element[i]);
                var URL = the.find("img").attr("src");
                var id = the.data("imgid");
                if(type=="img"||type=="video"){
                    var arr = kit.ids(DATA.adImages);
                    if(arr.indexOf(id)!=-1) continue;
                }else if(type=="carousel"){
                    arr = kit.ids(DATA.adImagesGroup);
                    if(arr.indexOf(id)!=-1) continue;
                }
                if(hwd){
                    var idx = hwd.parent().parent().index();//第几组图片
                    DATA.imgsRefine(id,null,idx);
                }else{
                    DATA.imgRefine(id);
                }
                html+= buildResourceHtml(type, id, URL, i);
            }
            return html;
        };

        function buildResourceHtml(_type, id, URL, _index){
            var _html = '';
            if ("img" == _type){
                //图片
                _html +=
                    '<li class="alert alert-dismissible" role="alert" data-type="'+_type+'" data-imgid="'+id+'">\
                        <img src="'+URL+'" width="100%" height="100%">\
                            <div>\
                                <button  class="close" data-dismiss="alert" aria-label="Close">\
                                    <span aria-hidden="true">&times;</span>\
                                </button>\
                                <span class="badge">1</span>\
                                <div class="btn-tools">\
                                    <button class="btn btn-default"><i class="glyphicon glyphicon-plus"></i></button>\
                                    <button class="btn btn-default"><i class="glyphicon glyphicon-minus"></i></button>\
                               </div>\
                            </div>\
                        </li>';
            } else if ("video" == _type) {
                //视频
                _html +=
                    '<li class="alert alert-dismissible" role="alert" data-type="'+_type+'" data-imgid="'+id+'">\
                        <img src="'+URL+'" width="100%" height="100%">\
                           <div>\
                              <button  class="close" data-dismiss="alert" aria-label="Close">\
                                 <span aria-hidden="true">&times;</span>\
                              </button>\
                            </div>\
                        </li>';
            } else {
                var totalTitle = DATA.adTitle;
                var isAr = kit.isAr(totalTitle);
                //轮播图
                _html +=
                    '<li class="alert alert-dismissible" role="alert" data-type="'+_type+'" data-imgid="'+id+'">\
                            <div class="number">' + I18N.getText('createAd', 'theNumber', _index + 1) + '</div>\
                            <img src="'+URL+'" width="100%" height="100%">\
                            <div class="lite-title-area">\
                                <div class="lite-title total-title" '+ (isAr ? 'dir="rtl"' : '') + '>' + totalTitle + '</div>\
                                <div class="hover-lite-title"> \
                                    <span '+ (isAr ? 'dir="rtl"' : '') + '>' + totalTitle + '</span>\
                                </div>\
                            </div>\
                            <div>\
                                <button  class="close" data-dismiss="alert" aria-label="Close">\
                                     <span aria-hidden="true">&times;</span>\
                                </button>\
                            </div>\
                     </li>';
            }

            return _html;
        }
        var bd = '<button class="btn btn-default" data-toggle="collapse" data-target="#advance" aria-expanded="false" aria-controls="advance">'
                + '<span class="hidden">'+I18N.getText('createAd', 'closeFilter')+'<i class="glyphicon glyphicon-menu-up"></i></span>'
                + '<span>' +I18N.getText('createAd', 'openFilter')+ '<i class="glyphicon glyphicon-menu-down"></i></span>'
                + '</button>'
                + '<ul class="list-group">'
                + '<li class="list-group-item">'
                + '<strong>'+ I18N.getText('createAd', 'appLabels')+'</strong>'
                + '<select class="dia-app" multiple  style="width:400px;"></select>'
                + '<span class="square-priority-label">'
                + '<a href="javascript:;" class="square-priority"> &nbsp;&nbsp;'
                + '<span>'+ I18N.getText('createAd', 'imageAlignment') +'</span>'
                + '&nbsp;&nbsp;<i class="fa fa-long-arrow-up"></i></a>'
                + '</span>'
                + '</li>'
                + '</ul>'
                + '<ul class="list-group collapse" id="advance">'
                + '<li class="list-group-item">'
                + '<strong>'+ I18N.getText('createAd', 'languageLabels') +'</strong>'
                + '<select class="dia-lang" multiple></select>'
                + '</li>'
                + '<li class="list-group-item">'
                + '<strong>'+ I18N.getText('createAd', 'genderLabels') +'</strong>'
                + '<div class="dia-gender input-drop dropdown" multiple style="left: 80px;"></div>'
                + '</li>'
                + '</ul>'
                + '<div class="pic-pool">'
                + '<select class="filter filter-tool"></select>'
                + '<ul class="nav nav-pills filter-tool" role="tablist">'
                + '<li><a><strong>'+ I18N.getText('createAd', 'sort') +'</strong></a></li>'
                + '<li role="presentation" class="active">'
                + '<a aria-controls="date" role="tab" data-toggle="tab" type="createTime" data-title="'+ I18N.getText('createAd', 'date') +'" data-sort-title="'+ I18N.getText('createAd', 'dateFromNearToFar') +'">'+ I18N.getText('createAd', 'dateFromNearToFar') +'</a>'
                + '</li>'
                + '<li role="presentation">'
                + '<a aria-controls="spent" role="tab" data-toggle="tab" type="spent"  data-title="'+ I18N.getText('createAd', 'cost') +'" data-sort-title="'+ I18N.getText('createAd', 'costFromHighToLow') +'"> '+ I18N.getText('createAd', 'cost') +'</a>'
                + '</li>'
                + '<li role="presentation">'
                + '<a aria-controls="results" role="tab" data-toggle="tab" type="results"  data-title="'+ I18N.getText('createAd', 'install') +'" data-sort-title="'+ I18N.getText('createAd', 'installFromHighToLow') +'">'+ I18N.getText('createAd', 'install') +'</a>'
                + '</li>'
                + '<li role="presentation">'
                + '<a aria-controls="ctr" role="tab" data-toggle="tab" type="ctr"  data-title="CTR" data-sort-title="'+ I18N.getText('createAd', 'CTRFromHighToLow') +'" >CTR</a>'
                + '</li>'
                + '</ul>'
                + '<ul class="pics-box"></ul>'
                + '</div>';

        $(hid).off("mousedown", "li.tab-pane-cell[data-toggle=modal]").on("mousedown", "li.tab-pane-cell[data-toggle=modal]" ,function(){
            var self = $(this);
            var gindex = $(this).parents("li.alert-dismissble").index();
            var id = $(this).data("target").replace("#","");
            //if($("body>div.modal.common-modal").children().length>0 && $("body>div.modal.common-modal").attr("id")==id) return;
            $("body>div.modal.common-modal").attr("id","132");
            $("body>div.modal.common-modal").off("hide.bs.modal").on("hide.bs.modal",function(e,o){
                if($('[name=asset1]:checked').val()=='carousel'){
                    $('#carousel [data-listidx]').each(function(){
                        if($(this).find('li[data-type="carousel"]').length==0){
                            DATA.adImagesGroup.pop();
                            $(this).parent().remove();
                        }
                    });
                    $(document).trigger("pixchanged");
                }
            });
            window.I18N = I18N;
            $("body>div.common-modal").dialog({//创建弹出的模式窗口
                id:id,
                label:$(this).data("label"),
                step:$(this).parent().siblings().length,
                title: I18N.getText('createAd', 'selectCreative'),
                body:bd,
                hwd:self,
                I18N:I18N
            }).off("ok").on("ok",function(e,o){//用户点击了弹出窗口上面确认按钮之后
                if(self.parent().attr("id")=="img"){//图片
                    var picbox = amIMG(o.imgs,"img");
                }else if(self.parent().parent().attr("id")=="video"){//视频
                    // if(!$("#video").has("div[id]").length){
                    $('#choosed-video-layer').remove();
                    var url = o.vid.find("img").attr("src");
                    var vMd5 = o.vid.data("videomd5");
                    console.log(vMd5)
                    DATA.videoRefine(vMd5);//
                    picbox = '<div id="choosed-video-layer">\
                                        <div class="alert alert-dismissible">\
                                           <i class="glyphicon glyphicon-play-circle"></i>\
                                            <i class="glyphicon glyphicon-remove"></i>\
                                            <img src="'+url+'" width="100%" height="100%">\
                                        <div>\
                                    </div>';

                    // }
                }else{
                    picbox = amIMG(o.imgs,"carousel",o.hwd);
                }
                if(self.parent().attr("id")=="img"){//图片
                    // self.parent().find('.alert-dismissible').remove();//删除之前选择的图片
                    if(picbox) $(picbox).insertBefore(self);
                    $("ul#img>li").css("height",($("ul#img>li").width()*0.66)+"px");
                }else if(self.parent().parent().attr("id")=="video"){//视频
                    $(self).siblings().remove();
                    DATA.adImages = [];

                    $(picbox).insertBefore(self.parent());
                    $(amIMG(o.imgs,"video")).insertBefore(self);
                    $("#video>ul>li").css("height",($("#video>ul>li").width()*0.66) + "px");
                }else{//轮播图片
                    //清除原来已选的图片
                    o.hwd.parents(".carousel-group").removeClass("hide");
                    o.hwd.css({"height":$("ul#carousel>li>ul>li").width()+"px"});
                    o.hwd.siblings().remove();
                    $(picbox).insertBefore(o.hwd);
                    if(o.hwd.siblings().length == 5) {
                        //只能添加五个图片
                        o.hwd.addClass('hidden');
                        o.hwd.siblings().on("closed.bs.alert",function(){
                            o.hwd.removeClass('hidden');
                            $(this).unbind("closed.bs.alert");
                        });
                    }
                    $("ul#carousel ul>li>img").css("height", ($("ul#carousel ul>li").width())+"px");
                }
                $(document).trigger("pixchanged");//图片选择发生了改变，修改默认广告结构比例
            });
            ga.live();
        });
    });
});
